3

tj

2025-05-22 14764dd7679369a650ad1d60be62aacc863755a1

 sub-pages/film-list/film-official-detail.vue

@@ -1,6 +1,6 @@
<template>
  <view>
  <view class="container">

    <view class="movie-title">
      <view><u-text text="破.地狱" size="30"></u-text></view>
      <view><u-text text="The Last Dance" size="20"></u-text></view>
@@ -9,8 +9,8 @@
    <scroll-view scroll-y class="content">
      <view class="movie-info">

        <image class="movie-poster" src="https://ai-public.mastergo.com/ai/img_res/1ef11f7a594da679d35cddf809a63ec7.jpg"
          mode="aspectFill" />
          <image class="movie-poster"
            src="https://ai-public.mastergo.com/ai/img_res/1ef11f7a594da679d35cddf809a63ec7.jpg" mode="aspectFill" />
        <view class="movie-details">
          <view class="scene-number">
            <text>片场</text>
@@ -52,15 +52,32 @@
          </swiper-item>
        </swiper>
      </view>
        <view class="comment">

      <view class="comment-section">
        <u-button class="comment-btn" type="primary" plain>我要发言</u-button>
          <comment-item avatar="https://img.yzcdn.cn/vant/cat.jpeg" nickname="图墙精选" :isAuthor="true"
            content="如果路线里全是常规景区，没一个特殊的点位，那就是普通团，除非他的住宿安排的很好。。要不然和普通团没任何区别，都是去景区挤，然后上车赶路" :images="urls2" date="2天前"
            address="湖北" :likes="30" @reply="showCommentLayer" />
      </view>
    </scroll-view>

    <view class="back-to-top" @click="scrollToTop">
      <u-icon name="arrow-up" size="24" color="#666666" />
    </view>

      <view class="comment-box">

        <view class="input-row">
          <view class="comment-input" @click="showCommentLayer">
            <u-text size="12px" text="说点什么......" margin="0rpx 0rpx 0rpx 20rpx" color="#B9B9B9"
              confirmType="send"></u-text>
          </view>
          <u-icon name="heart" size="60" color="#B9B9B9" label="11"></u-icon>
          <u-icon name="star" size="60" color="#B9B9B9" label="22"></u-icon>
          <u-icon name="chat" size="60" color="#B9B9B9" label="33"></u-icon>
        </view>
      </view>
    </view>
    <comment-popup v-model="commentShow" />
  </view>
</template>
<script>
@@ -114,6 +131,8 @@
        { name: '距离' },
        { name: '城市' },
      ],

      commentShow: false,
    };
  },
  methods: {
@@ -131,6 +150,9 @@
    },
    onSwiperChange(e) {
      this.current = e.detail.current; // 同步 tabs
    },
    showCommentLayer(e) {
      this.commentShow = true
    },
  }
};
@@ -271,3 +293,42 @@
  }
}
</style>
<style lang="scss" scoped>
.comment-box {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 20rpx 20rpx;
  background-color: #fff;
  box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.05);
  z-index: 999;
  height: 100rpx;

  .input-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 80%;

    .comment-input {
      width: 300rpx;
      background-color: #F4F4F6;
      border-radius: 50rpx;
      height: 60rpx;
      display: flex;
      align-items: center;
    }
  }

  .flex-input {
    flex: 1;
    margin-right: 10rpx;
  }
}

.comment{
  margin: 10rpx;
  margin-bottom: 180rpx;
}
</style>