微信小程序项目（SECTION B）

SECTION B首页部分

从上到下，依次是 搜索、轮播等

搜索就不用多说了，主要是数据库查询和变量更改

<view class="cu-bar search bg-blue">

      <image wx:if="{{userInfo==null}}" class="cu-avatar round" src="/pages/user/user-unlogin.png"></image> 
      <image wx:else class="cu-avatar round" src="{{userInfo.avatarUrl}}" bindtap="goBackhome"></image>
      
      <view class="search-form round">
        <text class="cuIcon-search"></text>
        <input type="text" placeholder="搜索食谱" confirm-type="search" bindfocus="giveMePlace" bindinput="getSearch"></input>
      </view>
      <view class="action" bindtap="searchGood">
        <text>搜索</text>
        <!-- <text class="cuIcon-triangledownfill"></text> -->
      </view>
    </view>

左侧头像是通过image标签实现

点击搜索会调用后台JS函数，点击查询结果，会跳转到食谱的对应界面。

searchGood() {
    var that = this
    wx.cloud.init()
    wx.cloud.callFunction({
      name: 'searchRecipeByName',
      data: {
        recipeName: that.data.searchData
      },
      complete: res => {
        if (res.result == null || res.result.data.length == 0) {
          that.setData({ searchGoodsData: [] })
          return
        }
        console.log("search result = ", res)
        that.setData({ searchRecipeData: res.result.data })
      }
    })
  },
  goToRecipe(e){
    wx.navigateTo({
      url: '../recipes/recipeDetail/recipeDetail?id=' + e.currentTarget.dataset.id,
    })
  },

一键三餐算法

点击对应菜谱

<view class="cu-bar bg-white">
  <view class="action">
    <text class="cuIcon-titles text-green"></text>
    <text class="text-xl text-bold" wx:if="{{!hasOneKey}}">温馨提示</text>
  </view>
</view>
<view class="cu-bar bg-white">
  <view class="action">
    <text class="cuIcon-titles text-green"></text>
    <text class="text-xl text-bold" wx:if="{{hasOneKey}}">营养三餐</text>
  </view>
</view>

<view class="cu-timeline" wx:if="{{!hasOneKey}}">
  <view class="cu-time">{{keyTime}}</view>
  <view class="cu-item cur text-red">
    <view class="content bg-red shadow-blur">
      <view>{{keyTips}}</view>
    </view>
  </view>
</view>


<view class="cu-timeline" wx:if="{{hasOneKey}}">
  <view class="cu-time">早餐</view>
  <view class="cu-item cur text-blue">
    <view class="content bg-blue shadow-blur" bindtap="goToDetail" data-id="{{foodsList[0].id}}">
      <view>{{foodsList[0].name}}</view>
    </view>
  </view>
</view>


<view class="cu-timeline" wx:if="{{hasOneKey}}" bindtap="goToDetail" data-id="{{foodsList[1].id}}">
  <view class="cu-time">午餐</view>
  <view class="cu-item cur text-red">
    <view class="content bg-red shadow-blur">
      <view>{{foodsList[1].name}}</view>
    </view>
  </view>
</view>

<view class="cu-timeline" wx:if="{{hasOneKey}}" bindtap="goToDetail" data-id="{{foodsList[2].id}}">
  <view class="cu-time">晚餐</view>
  <view class="cu-item cur text-grey">
    <view class="content bg-grey shadow-blur">
      <view>{{foodsList[2].name}}</view>
    </view>
  </view>
</view>

<button class="cu-btn block bg-blue margin-tb-sm lg" bindtap="oneKeyFoods" wx:if="{{!hasOneKey}}">一键营养三餐</button>

<button class="cu-btn block bg-blue margin-tb-sm lg" bindtap="addEatHistory" wx:if="{{hasOneKey}}">确认三餐</button>

<view class='cu-load load-modal' wx:if="{{loadModal}}">
  <!-- <view class='cuIcon-emojifill text-orange'></view> -->
  <image src='../../../icon/icon.png' class='png' mode='aspectFit'></image>
  <view class='gray-text'>随机中...</view>
</view>

随机三餐算法（简陋版）

wx.cloud.callFunction({
      name: 'searchRecipeByAll',
      data: {
        jmpCount: dk
      },
      complete: res => {
        console.log("random res = ", res)
        for (var i = 0; i < res.result.data.length; i++) {
          var recipeIng = res.result.data[i].recipeIng
          var isOk = true;
          for (var j = 0; j < recipeIng.length; j++) {
            for (var k = 0; k < recipeIng[j].length; k++) {
              //console.log(recipeIng[j][k])
              //"高血压", "高血脂", "糖尿病", "怀孕期", "其他病症"
              if (userSicks[0] == true && recipeIng[j][k] == '盐') {
                isOk = false;
                break
              } else if (userSicks[1] == true && recipeIng[j][k] == '肉') {
                isOk = false;
                break
              } else if (userSicks[2] == true && recipeIng[j][k] == '糖') {
                isOk = false;
                break
              } else if (userSicks[3] == true && recipeIng[j][k] == '油') {
                isOk = false;
                break
              }
            }
            if (isOk == false) {
              break
            }
          }
          if (isOk == true) {
            foodsList[flag] = res.result.data[i]
            this.setData({ foodsList: foodsList })
            flag++
            break
          }
        }
      }
    })

计算热力值!

onLoad: function (options) {
    wx.cloud.init()
    wx.cloud.callFunction({
      name:'searchAllUser',
      success: res => {
        console.log("rank res = ",res)
        var rankMan = res.result.data
        var rankNum = res.result.data.length
        for (var i = 0; i < rankNum; i++){
          for (var j = i + 1; j < rankNum; j++){
            var gradesA = rankMan[i].user_buynum * 500 + rankMan[i].user_loginnum * 50 + rankMan[i].user_readhelnum * 30 + rankMan[i].user_readrecnum * 30 ;

            var gradesB = rankMan[j].user_buynum * 500 + rankMan[j].user_loginnum * 50 + rankMan[j].user_readhelnum * 30 + rankMan[j].user_readrecnum * 30;
  
            if (gradesA < gradesB){
              var tmp = rankMan[i]
              rankMan[i] = rankMan[j]
              rankMan[j] = tmp
            }
          }
        }
        var grades = []
        for (var i = 0; i < rankNum; i++){
          grades[i] = rankMan[i].user_buynum * 500 + rankMan[i].user_loginnum * 50 + rankMan[i].user_readhelnum * 30 + rankMan[i].user_readrecnum * 30;
        }
        this.setData({ 
          userRankInfo: rankMan,
          userGrade: grades,
          userNum: rankNum
        })

        // wx.showToast({
        //   icon: 'success',
        //   title: '添加成功',
        // })
      },
    })
  }

根据后台算法，进行排名。

<view class="cu-bar bg-white">
  <view class="action">
    <text class="cuIcon-titles text-green"></text>
    <text class="text-xl text-bold">我的心情</text>
  </view>
</view>
<!-- 以下链接服务器 -->
<view class="cu-timeline" wx:for="{{logsNum}}" wx:key="key">
  <view class="cu-time">{{logsList[logsNum - index - 1].logs_time}}</view>
  <view class="cu-item cur text-{{color[index % 17]}}">
    <view class="content bg-{{color[index % 17]}} shadow-blur">
      <view>{{logsList[logsNum - index - 1].logs_info}}</view>
    </view>
  </view>
</view>



<view>
    <image src="../../home/images/bottom.png" mode="widthFix" style="width:100%;"/>
</view>

data: {
    logsList: [],
    color: ["red", "orange", "yellow", "olive", "green", "cyan", "blue", "purple", "mauve", "pink", "brown", "grey", "black", "darkGray", "gray", "ghostWhite", "white"],
    logsNum:0
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this
    wx.cloud.init()

    wx.cloud.callFunction({
      name:'searchUserLogs',
      complete: res => {
        that.setData({
          logsList: res.result.data,
          logsNum: res.result.data.length
        })
        wx.showToast({
          icon: 'success',
          title: '加载成功'
        });
      }
    })
  }