feat: 追剧分类跳转

mini/api/episode.js

@@ -36,6 +36,13 @@ export function trace() {
   )
 }
 
+export function list(params) {
+  return request.get(
+    'episode/list',
+    { params }
+  )
+}
+
 export function shared(id) {
   return request.post(
     `episode/shared/${id}`
@@ -69,6 +76,7 @@ export default {
   todayRecommend,
   detail,
   trace,
+  list,
   search,
   vipFree,
   listBuyNum

mini/pages.json

@@ -61,6 +61,13 @@
         "enablePullDownRefresh": false
       }
     },
+    {
+      "path": "pages/trace/list",
+      "style": {
+        "navigationBarTitleText": "张四爷剧场",
+        "enablePullDownRefresh": false
+      }
+    },
     {
       "path": "pages/my/consume",
       "style": {

mini/pages/trace/index.vue

@@ -31,7 +31,7 @@
       :key="index"
       class="category main-left"
     >
-      <view class="name">{{ item.name }}</view>
+      <view class="name" @click="$u.route({url: '/pages/trace/list', params:{cateId: item.id}})">{{ item.name }}</view>
       <view class="episode-box dir-left-wrap">
         <episode
           v-for="(episode,episodeIndex) in item.episodes"

mini/pages/trace/list.vue

@@ -0,0 +1,59 @@
+<template>
+  <view class="free-container dir-left-wrap">
+    <episode
+      v-for="(episode,index) in episodes"
+      :key="index"
+      :episode="episode"
+      :rank="episode.rank"
+      :custom-style="{
+        marginRight: ((index+1) % 3 !== 0 ? '20rpx' :''),
+      }"
+    />
+  </view>
+</template>
+
+<script>
+import Episode from '../../components/Episode/index'
+export default {
+  name: 'Free',
+  components: { Episode },
+  data() {
+    return {
+      cateId: 0,
+      limit: 30,
+      page: 1,
+      isMore: true,
+      episodes: []
+    }
+  },
+  computed: {},
+  methods: {
+    getLists() {
+      this.loading = true
+      this.$api.episode.list({ cateId: this.cateId, page: this.page }).then(res => {
+        this.loading = false
+        if (res.data.length) {
+          this.episodes = this.episodes.concat(res.data)
+        } else {
+          this.isMore = false
+        }
+      })
+    }
+  },
+  onLoad(options) {
+    this.cateId = options.cateId
+    this.getLists()
+  },
+  onReachBottom(e) {
+    if (!this.isMore) return
+    this.page += 1
+    this.getLists()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .free-container {
+    padding: 20rpx;
+  }
+</style>

server/app/Http/Controllers/V1/EpisodeController.php

@@ -171,6 +171,34 @@ class EpisodeController extends Controller
         return $this->success($lists);
     }
 
+    public function list()
+    {
+        $limit = request()->input('limit',  $this->number);
+        $page = request()->input('page',1);
+        $cateId = request()->input('cateId',0);
+        $offset = ($page - 1) * $limit;
+        $episodes = Episode::withCount(['lists'])
+            ->when($cateId, function ($query, $cateId){
+                /* @var Builder  $query*/
+                return $query->where('category_id',$cateId);
+            })
+            ->where('is_opend', 1)
+            ->where('platform', \user()->info->platform)
+            ->limit($limit)
+            ->offset($offset)
+            ->get();
+
+        $lists = [];
+        /* @var Episode $episode*/
+        foreach ($episodes as $episode){
+            $episode->status_text = $episode->status;
+            $episode->total = $episode->lists_count;
+            $lists[] = $episode;
+        }
+
+        return $this->success($lists);
+    }
+
     // 追剧
     public function trace()
     {

server/routes/api.php

@@ -159,6 +159,7 @@ $api->version('v1', ['namespace' => 'App\Http\Controllers\V1'], function ($api)
             $api->get('news', 'EpisodeController@news'); // 最新
             $api->get('rank', 'EpisodeController@rank'); // 排行
             $api->get('trace', 'EpisodeController@trace'); // 追剧
+            $api->get('list', 'EpisodeController@list'); // 列表
             $api->get('search', 'EpisodeController@search'); // 搜索
             $api->get('vip/free', 'EpisodeController@vipFree'); // banner
             $api->get('{id}/detail', 'EpisodeController@detail'); // 详情