feat：修改农场美景样式

src/components/UserPanel.vue

@@ -28,7 +28,7 @@
             :key="v"
             class="grid-item"
           >
-            <img src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png" class="cover" alt="" />
+            <img src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" class="cover" alt="" />
           </div>
         </div>
       </div>
@@ -51,22 +51,15 @@ type PanelItem = {
   author?: {
     nickname?: string
     signature?: string
-    avatar_168x168?: { url_list?: string[] }
   }
-  video?: { cover?: { url_list?: string[] } }
 }
 
 const props = defineProps({
   currentItem: { type: Object, default: () => ({}) },
-  active: { type: Boolean, default: false },
 })
 
 const emit = defineEmits<{
   back: []
-  toggleCanMove: [boolean]
-  showFollowSetting: []
-  showFollowSetting2: []
-  'update:currentItem': [unknown]
 }>()
 
 const router = useRouter()
@@ -96,23 +89,13 @@ const adoptFriendsText = computed(() => {
   return `${n}个朋友认养`
 })
 
-const avatarUrl = computed(() => {
-  const cover = item.value.video?.cover?.url_list?.[0]
-  const avatar = author.value.avatar_168x168?.url_list?.[0]
-  return (
-    // _checkImgUrl(cover || avatar) ||
-    'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'
-  )
-})
+const avatarUrl =
+  'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'
 
 function onGuard() {
   _notice('守护功能开发中')
   router.push('/my-guard')
 }
-
-defineExpose({
-  cancelFollow: () => { },
-})
 </script>
 
 <style scoped lang="less">
@@ -150,7 +133,7 @@ defineExpose({
   }
 
   .main {
-    padding: 6rem 18rem;
+    padding: 6rem 18rem 0;
 
     .farm-card {
       .farm-header {
@@ -206,25 +189,23 @@ defineExpose({
     }
 
     .works-section {
-      margin-top: 12rem;
       margin-left: -18rem;
       margin-right: -18rem;
 
       .works-tabs {
-        padding: 10rem 18rem 0;
+        padding: 24rem 18rem 0;
         background: #fff;
+        margin-bottom: 14rem;
 
         .tab {
           display: inline-block;
-          font-size: 15rem;
           font-weight: 500;
           color: #b0b0b0;
           padding-bottom: 10rem;
           position: relative;
 
           &.active {
-            color: #1d2129;
-            font-weight: 600;
+            color: #000;
 
             &::after {
               content: '';
@@ -245,7 +226,6 @@ defineExpose({
         grid-template-columns: repeat(3, 1fr);
         gap: 2rem;
         padding: 2rem 0;
-        background: #161616;
 
         .grid-item {
           aspect-ratio: 3 / 4;

src/views/home/index.vue

@@ -107,7 +107,7 @@
           :change-active-index-use-anim="false"
         >
           <Slide0 :active="state.navIndex === 0 && state.baseIndex === 1" />
-          <Slide4 :active="state.navIndex === 1 && state.baseIndex === 1" />
+          <Slide1 :active="state.navIndex === 1 && state.baseIndex === 1" />
         </SlideHorizontal>
 
         <BaseFooter :init-tab="1" />
@@ -120,12 +120,8 @@
       </SlideItem>
       <SlideItem>
         <UserPanel
-          v-model:current-item="state.currentItem"
-          :active="state.baseIndex === 2"
-          @toggle-can-move="(e: boolean) => (state.canMove = e)"
+          :current-item="state.currentItem"
           @back="state.baseIndex = 1"
-          @show-follow-setting="state.showFollowSetting = true"
-          @show-follow-setting2="state.showFollowSetting2 = true"
         />
       </SlideItem>
     </SlideHorizontal>
@@ -151,7 +147,7 @@ import bus, { EVENT_KEY } from '@/utils/bus'
 import { useNav } from '@/utils/hooks/useNav'
 import UserPanel from '@/components/UserPanel.vue'
 import Slide0 from './slide/Slide0.vue'
-import Slide4 from './slide/Slide4.vue'
+import Slide1 from './slide/Slide1.vue'
 import { _no, _notice } from '@/utils'
 import BaseMask from '@/components/BaseMask.vue'
 import BaseFooter from '@/components/BaseFooter.vue'
@@ -167,9 +163,6 @@ const state = reactive({
   active: true,
   baseIndex: 1,
   navIndex: 1,
-  canMove: true,
-  showFollowSetting: false,
-  showFollowSetting2: false,
   commentVisible: false,
   fullScreen: false,
   currentItem: {

src/views/home/slide/Slide2.vue

@@ -1,58 +0,0 @@
-<script setup lang="ts">
-import SlideItem from '@/components/slide/SlideItem.vue'
-import { followFeed, formatCount } from '@/mock/homeData'
-
-defineProps({ active: { type: Boolean, default: false } })
-</script>
-
-<template>
-  <SlideItem>
-    <div class="follow-feed">
-      <div v-for="item in followFeed" :key="item.aweme_id" class="item">
-        <img :src="item.video.cover.url_list[0]" class="cover" alt="" />
-        <div class="info">
-          <p class="desc">{{ item.desc }}</p>
-          <p class="meta">@{{ item.author.nickname }} · {{ formatCount(item.statistics.digg_count) }}赞</p>
-        </div>
-      </div>
-    </div>
-  </SlideItem>
-</template>
-
-<style scoped lang="less">
-.follow-feed {
-  height: 100%;
-  overflow-y: auto;
-  background: #000;
-  padding: 10rem;
-
-  .item {
-    margin-bottom: 12rem;
-    border-radius: 8rem;
-    overflow: hidden;
-    background: rgb(29, 29, 29);
-
-    .cover {
-      width: 100%;
-      height: 140rem;
-      object-fit: cover;
-    }
-
-    .info {
-      padding: 10rem 12rem;
-      color: white;
-
-      .desc {
-        margin: 0 0 6rem;
-        font-size: 14rem;
-      }
-
-      .meta {
-        margin: 0;
-        font-size: 12rem;
-        opacity: 0.6;
-      }
-    }
-  }
-}
-</style>