✨ feat(客户端): 新增关注页，未看页

@@ -181,6 +181,22 @@ export default [{
   },
   },
   children: []
   children: []
 }, {
 }, {
+  path: '/me/followList',
+  name: '关注',
+  component: () => import('./views/me/followList.vue'),
+  meta: {
+    title: '关注'
+  },
+  children: []
+}, {
+  path: '/me/unwatchList',
+  name: '未看作品',
+  component: () => import('./views/me/unwatchList.vue'),
+  meta: {
+    title: '未看作品'
+  },
+  children: []
+}, {
   path: '/image',
   path: '/image',
   name: 'html转图片',
   name: 'html转图片',
   component: () => import('./views/html2canvas.vue'),
   component: () => import('./views/html2canvas.vue'),

+<template>
+  <div class="follow-list-page">
+    <div class="info van-hairline--bottom">
+      <van-row>
+        <van-col>
+          <van-image round width="50" height="50" src="https://cdn.jsdelivr.net/npm/@vant/assets/cat.jpeg"
+            style="padding-right: 1rem;" />
+        </van-col>
+        <van-col class="text-wrapper" span="18">
+          <div>
+            <div class="username">瑟日古娜</div>
+            <div class="user-status">已关注</div>
+          </div>
+          <div class="address">呼和浩特市新城区蒙古族幼儿园</div>
+        </van-col>
+      </van-row>
+    </div>
+    <div class="info van-hairline--bottom">
+      <van-row>
+        <van-col>
+          <van-image round width="50" height="50" src="https://cdn.jsdelivr.net/npm/@vant/assets/cat.jpeg"
+            style="padding-right: 1rem;" />
+        </van-col>
+        <van-col class="text-wrapper" span="18">
+          <div>
+            <div class="username">瑟日古娜</div>
+            <div class="user-status">已关注</div>
+          </div>
+          <div class="address">呼和浩特市新城区蒙古族幼儿园</div>
+        </van-col>
+      </van-row>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import axios from '@/utils/axios';
+import $ from 'jquery'
+import { Toast } from 'vant';
+const $route = useRoute();
+const $router = useRouter();
+
+  onMounted(() => {
+    
+  })
+</script>
+
+<script>
+import mixin from 'common/mixin';
+
+export default {
+  mixins: [mixin.init],
+  data () {
+    return {
+
+    }
+  },
+  mounted () {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.follow-list-page {
+  .info {
+    padding: 2rem; 
+    padding-right: 0;
+    .text-wrapper {
+      line-height: 1.5;
+      .username {
+        display: inline-block; 
+        overflow: auto; 
+        font-size: 1.15rem; 
+        color: #222222;
+      }
+      .user-status {
+        float: right;
+        font-size: 0.8rem; 
+        background-color: white; 
+        border-radius: 15px; 
+        padding: 5px 10px; 
+        color: #999999;
+        border: 1px solid #EEEDED;
+      }
+    }
+    .address {
+      font-size: 0.85rem; 
+      color: #999999;
+    }
+  }
+}
+</style>
\ No newline at end of file

@@ -29,12 +29,12 @@
             <p>45</p>
             <p>45</p>
           </van-col>
           </van-col>
           <van-col span="1" class="divide">|</van-col>
           <van-col span="1" class="divide">|</van-col>
-          <van-col span="5">
+          <van-col span="5" @click="getFollow">
             <p class="tap-color">关注</p>
             <p class="tap-color">关注</p>
             <p>26</p>
             <p>26</p>
           </van-col>
           </van-col>
           <van-col span="1" class="divide">|</van-col>
           <van-col span="1" class="divide">|</van-col>
-          <van-col span="5">
+          <van-col span="5" @click="getUnwatch">
             <p class="tap-color">未看</p>
             <p class="tap-color">未看</p>
             <p><van-tag round color="red">28</van-tag></p>
             <p><van-tag round color="red">28</van-tag></p>
           </van-col>
           </van-col>
@@ -139,6 +139,17 @@ const itemList = [
   },
   },
 ]
 ]
 
 
+const getFollow = () => {
+  $router.push({
+    path: '/me/followList'
+  })
+}
+const getUnwatch = () => {
+  $router.push({
+    path: '/me/unwatchList'
+  })
+}
+
 onMounted(() => {
 onMounted(() => {
 
 
 })
 })

+<template>
+  <div class="unwatch-list-page">
+    <van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
+      <template v-for="item in dataList" :key="item" style="height: 3rem;">
+        <video-card :item="item"></video-card>
+      </template>
+    </van-list>
+  </div>
+</template>
+
+<script setup>
+import dataList from '@/mock/video_list'
+import VideoCard from '@/components/VideoCard/index.vue'
+
+import { ref, reactive, onMounted } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import axios from '@/utils/axios';
+import $ from 'jquery'
+import { Toast } from 'vant';
+const $route = useRoute();
+const $router = useRouter();
+
+// 处理书籍下作品列表
+const list = ref([]);
+const loading = ref(false);
+const finished = ref(false);
+
+const onLoad = () => {
+  // 异步更新数据
+  // setTimeout 仅做示例，真实场景中一般为 ajax 请求
+  setTimeout(() => {
+    for (let i = 0; i < 20; i++) {
+      list.value.push(list.value.length + 1);
+    }
+
+    // 加载状态结束
+    loading.value = false;
+
+    // 数据全部加载完成
+    if (list.value.length >= 100) {
+      finished.value = true;
+    }
+  }, 1000);
+};
+
+  onMounted(() => {
+    
+  })
+</script>
+
+<script>
+import mixin from 'common/mixin';
+
+export default {
+  mixins: [mixin.init],
+  data () {
+    return {
+
+    }
+  },
+  mounted () {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.unwatch-list-page {}
+</style>
\ No newline at end of file