适合做毕业设计的校园表白墙小程序

Function_{}

已于 2024-08-15 14:52:18 修改

阅读量99

点赞数 3

分类专栏： PHP 文章标签：课程设计 php uni-app 学习

于 2024-08-12 18:19:06 首次发布

本文链接：https://blog.csdn.net/weixin_43665049/article/details/141138452

版权

PHP 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

微信小程序开发

功能：

1. 表白墙

2. 卖舍友

3. 步数旅行

4. 情侣脸

功能简单，适合计算机专业学生的毕设，也适合专门做某大学校园业务的轻创业项目的引流

部分源代码分享

<!--index.wxml-->
<view class='wall-container'>
  <!-- 导航栏 -->
  <view class="navigation">
    <view class="navigation-item"><view data-type="1" bindtap="selected" class="select-tab">全部</view><view class='{{select==1?"select-tab-bootom":""}}'></view></view>
    <view class="navigation-item"><view data-type="4" bindtap="selected" class="select-tab">最热</view><view class='{{select==4?"select-tab-bootom":""}}'></view></view>
    <view class="navigation-item"><view data-type="2" bindtap="selected" class="select-tab">收藏</view><view class='{{select==2?"select-tab-bootom":""}}'></view></view>
    <view class='search-container'>
        <view class='search'>
          <input type='text' 
                class='search-input' 
                placeholder="输入你要找的表白消息"         
                bindinput='getFilter'/>
          <view class='search-image' bindtap='search'>
              <image mode="" src='/image/v2/index-search.png'></image>
          </view>
        </view>
    </view>
  </view>

  <!-- 内容 -->
  <view class='body-content'>
    <!-- 话题 -->
    <view class="topic-content" bindtap='openTopic' data-id="{{topic.id}}" wx:if="{{showTopic}}">
      <view class="topic-title"><view class="title"><view>今日话题</view></view></view>
      <image class="topic-image" mode="aspectFill" src="{{baseImageUrl+topic.attachments[0]}}"></image>
      <view class="topic-data">
        <view class="topic-data-content">{{topic.content}}</view>
      </view>
      <view class="topic-bottom">
        <view class="topic-bottom-content">
          <view class="topic-bottom-left"><image src="/image/v2/index-browse.png"></image><view>{{topic.view_number}}次</view></view>
          <view class="topic-bottom-middle"><image src="/image/v2/index-topic-zan.png"></image><view>{{topic.praise_number}}</view></view>
          <view class="topic-bottom-right"><image src="/image/v2/index-topic-comment.png"></image><view>{{topic.comment_number}}</view></view>
        </view>
      </view>
    </view>
    <!-- 表白墙flag -->
    <view class="body-flag" wx:if="{{showTopic}}">
      <view class="flag">表白墙</view>
      <view class="flag-tab"></view>
    </view>

    <!-- 表白墙列表 -->
    <view class="body-list" bindtouchmove="hiddenComment">
      <view class="body-item"  wx:for="{{posts}}" wx:key="id">
        <view class="item-header">
          <view class="avatar-item" bindtap="openUserInfo" data-id="{{item.poster.id}}">
            <image class="avatar-border" src="/image/v2/border.png"></image>
            <image class="user-avatar" src="{{item.poster.avatar}}"></image>
          </view>
          <view class="nickname-item" bindtap="openUserInfo" data-id="{{item.poster.id}}">
            <view class="nickname-top">
              <view class="poster-nickname">{{item.poster.nickname}}</view>
              <image src="/image/v2/index-admin.png" wx:if="{{item.supertube == 1}}"></image>
            </view>
            <view class="nickname-bottom">
              <view class="nickname-flag" wx:if="{{item.topic != '无'}}">表白@</view>
              <view class="bottom-name" wx:if="{{item.topic != '无'}}">{{item.topic}}</view>
            </view>
          </view>
          <view class="icon-item">
            <image  src="/image/v2/index-delete.png" 
                    id="{{item.id}}"
                    wx:if="{{item.can_delete}}" 
                    bindtap='deletePost'></image>
            <image src="/image/v2/index-collect.png" wx:if="{{item.follow}}" data-obj="{{item.id}}"  bindtap="cancelFolllow"></image>
            <image src="/image/v2/index-not-collect.png" wx:if="{{!item.follow}}" data-obj="{{item.id}}" bindtap="follow"></image>
          </view>
        </view>
        <view class="item-content">
          <view class="item-content-word" wx:if="{{item.content}}">{{item.content}}</view>
          <view class="item-content-image" wx:if='{{item.attachments.length>=1}}'>
            <image mode="aspectFill"
                  wx:for="{{item.attachments}}" 
                   wx:key="id"
                   wx:for-item="sitem"
                   src="{{baseImageUrl+sitem}}" 
                   bindtap='previewMoreImage'
                   data-obj="{{item.attachments}}"
                   id="{{baseImageUrl+sitem}}"></image>
          </view>
        </view>
        <view class="item-footer">
          <view class="date">{{item.created_at}}</view>
          <view class="letter-icon">
            <image bindtap='showCommentInput' 
                data-objid="{{item.id}}"
                data-objtype='1' src="/image/v2/index-topic-comment.png"></image>
            <view>{{item.comments.length}}</view>
          </view>
          <view class="letter-icon">
            <image data-obj="{{item.id}}" bindtap='praise' src="/image/v2/index-topic-zan.png"></image>
            <view>{{item.praises.length}}</view>
          </view>
        </view>
        <!-- 评论 -->
        <view class="comment-content">
          <view class="praise-content" wx:if="{{item.praises.length > 0}}">
            <view class="praise-left"><image src="/image/v2/index-like.png"></image></view>
            <view class="praise-right">
              <view class="praise-item" 
                    bindtap="openUserInfo"
                    data-id="{{item.user_id}}"
                    wx:for="{{item.praises}}" 
                    wx:key="id">
                <image src="{{item.avatar}}"></image>
                <view class="praise-name">{{item.nickname}}</view>
              </view>
            </view>
          </view>
          <view class="comment-list" wx:if="{{item.comments.length > 0}}" >
            <view class="comment-left"><image src="/image/v2/fill-comment.png"></image></view>
            <view class="comment-right">
              <view class="comment-item" 
                    wx:if="{{!sub.ref_comment}}"
                    wx:for="{{item.comments}}" 
                    wx:key="id" 
                    wx:for-item="sub"
                    bindtap="{{sub.can_delete?'deleteComment':'commentOtherComment'}}"
                    data-objid="{{item.id}}"
                    data-refid="{{sub.id}}" 
                    data-objtype='1'>
                <image src="{{sub.commenter.avatar}}"></image>
                <view class="comment-name"  wx:if="{{sub.author == 0 && sub.commenter.supertube != 1}}">{{sub.commenter.nickname}}</view>
                <view class="comment-name"  wx:if="{{sub.author == 1 && sub.commenter.supertube != 1}}">{{sub.commenter.nickname}}(楼主)</view>
                <view class="comment-name"  wx:if="{{sub.commenter.supertube == 1}}">{{sub.commenter.nickname}}(超管)</view>
                <view class="comment-word">：{{sub.content}}</view>
              </view>

              <view class="comment-item" 
                    wx:if="{{sub.ref_comment}}"
                    wx:for="{{item.comments}}" 
                    wx:key="id" 
                    wx:for-item="sub"
                    bindtap="{{sub.can_delete?'deleteComment':'commentOtherComment'}}"
                    data-objid="{{item.id}}"
                    data-refid="{{sub.id}}" 
                    data-objtype='1'>
                    <image src="{{sub.commenter.avatar}}"></image>
                  <view class="comment-name">{{sub.commenter.nickname}}</view>
                  <view class="comment-word">回复：</view>
                  <image src="{{sub.ref_comment.refCommenter.avatar}}"></image>
                  <view class="comment-name">{{sub.ref_comment.refCommenter.nickname}}：</view>
                  <view class="comment-word">{{sub.content}}</view>
              </view>

            </view>
          </view>
        </view>
      </view>
    </view>
  </view>

  <view class='message-tip' 
        wx:if="{{newMessage}}" 
        bindtap='openMessage'>
    <view class='tip-content'>
      <image src='/image/v2/bell.png'></image>
      <view>{{newMessageNumber}}条新消息</view>
    </view>
  </view>

  <!-- 发布表白信息 -->
  <view class='post-container'>
    <view class='wall'></view>
    <view class='post'>
      <image src='/image/v2/index-poster.png' bindtap='post'></image>
    </view>
  </view>

    <!-- 输入框 -->
  <view class='comment-input-container' wx:if="{{showCommentInput}}">
    <textarea placeholder="评论" 
              auto-focus
              maxlength="1024"
              cursor-spacing="15"
              fixed="true"
              auto-height 
              bindinput='getCommentContent'/>
    <view class='send-button' bindtap='sendComment'><view>发送</view></view>
  </view>

</view>