上传文件至 '前端/miniprogram/pages/add_new_food'

前端/miniprogram/pages/add_new_food/add_new_food.js

@@ -0,0 +1,237 @@
+const app = getApp();
+Page({
+  data: {
+    search_height:120,
+    scroll_height:0,
+    result:null,
+    result_num:0,
+    selected_item:null,
+    title:"搜索食材",
+    amount:0,
+    unit:null,
+    inputValue:null,
+    types:['蔬菜','豆/豆制品','肉禽蛋','水产海鲜','水果','乳品烘焙','粮油米面','调味品','酒水饮料','熟食卤味','速食冻品'],
+    selected_type:"蔬菜",
+    pre_results:null
+  },
+  get_pre_types(){
+      var that = this
+    wx.cloud.callContainer({
+        "config": {
+          "env": "prod-2g058voqbea31ecb"
+        },
+        "path": "fridge/search/",
+        "header": {
+          "X-WX-SERVICE": "django-5198",
+          'content-type': 'application/x-www-form-urlencoded;charset=utf-8'
+        },
+        "method": "GET",
+        data:{content:encodeURI("蔬菜")},
+        success(res){
+          console.log(res)
+          let arr = app.parse_json(res)
+          that.setData({
+            pre_results:arr
+          })
+        },
+      })
+  },
+  onLoad(){
+    this.get_pre_types()
+  },
+  
+  bindKeyInput: function (e){
+    var that = this
+    if(e.detail.value){
+        wx.cloud.callContainer({
+        "config": {
+          "env": "prod-2g058voqbea31ecb"
+        },
+        "path": "fridge/search/",
+        "header": {
+          "X-WX-SERVICE": "django-5198",
+          'content-type': 'application/x-www-form-urlencoded;charset=utf-8'
+        },
+        "method": "GET",
+        data:{content:encodeURI(e.detail.value)},
+        success(res){
+          console.log(res)
+          let arr = app.parse_json(res)
+          if(arr.length<=12){
+            that.setData({
+              result:arr,
+              search_height:Number(arr.length*100+120),
+              scroll_height:Number(arr.length*100)
+            })
+          }
+          else{
+            that.setData({
+              result:arr,
+              search_height:Number(1260),
+              scroll_height:Number(1120)
+            })
+          }
+        },
+      })
+    } 
+    else{
+      console.log('sds')
+      this.setData({
+        result:null,
+        search_height:120,
+        scroll_height:0,
+        selected_item:null
+      })
+    }
+  },
+  onTapSpecificItem(e){
+    var that = this
+    this.setData({
+      selected_item:e.currentTarget.dataset.product,
+      title:"确认食材"
+    })
+    wx.showModal({
+      title: '输入'+e.currentTarget.dataset.product.name+"的数量",
+      showCancel : true,
+      confirmText:"确定",
+      cancelText:"取消",
+      editable:true,
+      placeholderText:"如：3",
+      success:(res)=>{
+        if(res.confirm){
+          if(res.content){
+            
+          that.setData({
+            amount: res.content
+          })
+          wx.showModal({
+            title: '输入'+e.currentTarget.dataset.product.name+"的单位",
+            showCancel : true,
+            confirmText:"确定",
+            cancelText:"取消",
+            editable:true,
+            placeholderText:"如：个",
+            success:(res)=>{
+              if(res.confirm){
+                if(res.content){
+                  that.setData({
+                    unit: res.content
+                })
+                wx.showModal({
+                  title: "提示",
+                  content:"确定添加 "+that.data.amount+that.data.unit+e.currentTarget.dataset.product.name+" 至你的冰箱吗？",
+                  showCancel : true,
+                  confirmText:"确定",
+                  cancelText:"取消",
+                  success:(res)=>{
+                    if(res.confirm){
+                      that.sendNewFood()
+                    }
+                  }
+                })
+                }
+                else{
+                  wx.showModal({
+                    title: '错误',
+                    content:"请输入单位！",
+                    showCancel : false,
+                    confirmText:"确定",
+                  })
+                }
+                
+              }
+            }
+          })
+          }
+          else{
+            wx.showModal({
+              title: '错误',
+              content:"请输入数量！",
+              showCancel : false,
+              confirmText:"确定",
+            })
+          }
+        }
+      }
+    })
+  },
+  onTapSpecificType(e){
+    var that = this
+    this.setData({
+      selected_type:e.currentTarget.dataset.product,
+    })
+    var that = this
+    wx.cloud.callContainer({
+        "config": {
+          "env": "prod-2g058voqbea31ecb"
+        },
+        "path": "fridge/search/",
+        "header": {
+          "X-WX-SERVICE": "django-5198",
+          'content-type': 'application/x-www-form-urlencoded;charset=utf-8'
+        },
+        "method": "GET",
+        data:{content:encodeURI(e.currentTarget.dataset.product)},
+        success(res){
+          console.log(res)
+          let arr = app.parse_json(res)
+          that.setData({
+            pre_results:arr
+          })
+        },
+      })
+  },
+  bindAmountInput:function(e){
+    this.setData({
+      amount:e.detail.value
+    })
+  },
+  bindUnitInput:function(e){
+    this.setData({
+      unit:e.detail.value
+    })
+  },
+  sendNewFood(){
+    var that = this
+    wx.cloud.callContainer({
+      "config": {
+        "env": "prod-2g058voqbea31ecb"
+      },
+      "path": "fridge/new-food/",
+      "header": {
+        "X-WX-SERVICE": "django-5198",
+        'content-type': 'application/x-www-form-urlencoded'
+      },
+      "method": "POST",
+      data: {
+        name:that.data.selected_item.name,
+        kind:that.data.selected_item.kind,
+        amount:that.data.amount,
+        unit:that.data.unit},
+      success(res){
+        wx.showToast({
+          title: '添加成功',
+          duration:1500,
+          mask:true,
+          icon:'success'
+        })
+        that.setData({
+          search_height:120,
+          scroll_height:0,
+          result:null,
+          result_num:0,
+          selected_item:null,
+          title:"搜索食材",
+          amount:0,
+          unit:null,
+          inputValue:null
+      })
+      }
+    })
+  },
+  back(){
+    wx.navigateBack({
+      delta: 0,
+    })
+  }
+})

前端/miniprogram/pages/add_new_food/add_new_food.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

前端/miniprogram/pages/add_new_food/add_new_food.wxml

@@ -0,0 +1,39 @@
+<!--fridge.wxml-->
+
+
+<text class="title1">{{title}}</text>
+<view style="position: fixed;left:4%;top:8%" bindtap="back" hover-class="back">
+  <text style="font-size: 60rpx;padding-left: 10rpx;padding-right:20rpx;background-color: rgba(255, 255, 255, 0.5);border-radius: 20%;box-shadow: 0px 0px 20px 0 rgba(133, 100, 100, 0.37);" decode="true">&lt;</text>
+</view>
+
+<view class="searchbar" style="height: {{search_height}}rpx;" >
+    <view class="weui-cells weui-cells_after-title">
+      <view class="weui-cell weui-cell_input">
+        <input value='{{inputValue}}'  class="weui-input" style="margin-left: 5%;margin-top:5%;width:100%;font-weight:bold;font-size: 20px;line-height: 21px;letter-spacing: 0px;"  maxlength="10" bindinput="bindKeyInput" placeholder-class="title2" placeholder="在此输入食材名以搜索"/>
+      </view>
+    </view>
+    <scroll-view wx:if="{{result}}" class ="scroll-search" scroll-y="true" style="height: {{scroll_height}}rpx;" >
+        <view wx:for="{{result}}" class="result" bindtap="onTapSpecificItem" data-product="{{item}}">
+        <view wx:if="{{result}}">{{item.kind}}-{{item.name}}</view>
+        <view wx:else>查不到</view>
+        </view>
+    </scroll-view>
+    <view wx:else class="pre-search" >
+        <view>
+            <view style="width: 30%;" bindtap="onTapSpecificType" data-product="{{item}}" wx:for="{{types}}" class="types" >{{item}}</view>
+        </view>
+        <scroll-view class ="pre-search-results" scroll-y="true">
+            <view wx:for="{{pre_results}}" class="result" bindtap="onTapSpecificItem" data-product="{{item}}">
+                {{item.name}}
+            </view>
+            <view style="padding-bottom: 30%;"></view>
+        </scroll-view>
+    </view>
+</view>
+
+
+
+
+<view class="deco1"></view>
+<view class="deco2"></view>
+

前端/miniprogram/pages/add_new_food/add_new_food.wxss

@@ -0,0 +1,166 @@
+
+Page{
+  background: white
+}
+
+.DetailedFoodTypeContainer{
+  margin-left: 30rpx;
+  margin-right: 30rpx;
+  width: auto;
+  margin-top: 5%;
+  /*background: rgba(255, 208, 121, 0.329);*/
+  /*box-shadow: 3px 10px 40px rgba(26, 77, 160, 0.16),inset 0px 5px 0px rgba(187, 187, 187, 0.021);*/
+  border-radius: 20rpx;
+  background: rgba(255, 255, 255, 0.5);
+  box-shadow: 0 0px 32px 0 rgba(103, 104, 121, 0.37);
+  backdrop-filter: blur( 7px );
+  border: 1px solid rgba( 255, 255, 255, 0.18 );
+  z-index: 0;
+}
+
+.searchbar{
+  margin-left: 30rpx;
+  margin-right: 30rpx;
+  width: auto;
+  margin-top: 32%;
+  /*background: rgba(255, 208, 121, 0.329);*/
+  /*box-shadow: 3px 10px 40px rgba(26, 77, 160, 0.16),inset 0px 5px 0px rgba(187, 187, 187, 0.021);*/
+  border-radius: 60rpx;
+  background: rgba(255, 255, 255, 0.5);
+  box-shadow: 0px 0px 20px 0 rgba(133, 100, 100, 0.37);
+  backdrop-filter: blur( 100px );
+  border: 1px solid rgba( 255, 255, 255, 0.18 );
+  z-index: -1;
+}
+
+.search_icon{
+  position: fixed;
+  text-align: justify;
+  font-size: 20px;
+  font-weight: 800;
+  z-index: 10;
+  right: 1%;
+  top:2%;
+  padding: 4%;
+
+}
+
+.deco1{
+  /* Rectangle 2 */
+  position: absolute;
+  width: 49.37px;
+  height: 321.5px;
+  top: -30rpx;
+  right:20rpx;
+  background: linear-gradient(rgba(245, 186, 173, 0.068)5%,rgba(231, 153, 139, 0.075) 50%);
+  transform: rotate(135deg);
+  border-radius: 20rpx;
+  z-index: -10;
+}
+
+.deco2{
+  /* Rectangle 2 */
+  position: absolute;
+  width: 49.37px;
+  height: 321.5px;
+  top: -30rpx;
+  right:250rpx;
+  background: linear-gradient(rgba(245, 186, 173, 0.075)5%,rgba(231, 153, 139, 0.075) 20%);
+  transform: rotate(135deg);
+  border-radius: 20rpx;
+  z-index: -10;
+}
+
+.title1{
+  width:75%;
+  position: absolute;
+  left:17%;
+  top:8%;
+  font-weight:bold;
+  font-size: 30px;
+  animation: show_up 1s;
+}
+
+.title2{
+  width:100%;
+  font-weight:bold;
+  font-size: 20px;
+  line-height: 21px;
+  letter-spacing: 0px;
+}
+
+.title3{
+  width:100%;
+  font-weight:bold;
+  font-size: 21px;
+  line-height: 21px;
+  letter-spacing: 0px;
+  margin-left:2%;
+  margin-top: 3%;
+}
+
+.scroll-search{
+  top: 50rpx;
+  position: relative;
+  margin-left: 10%;
+  width: 80%;
+}
+
+.result{
+  height: 100rpx;
+  font-weight: bold;
+  font-size: medium;
+}
+
+.check_food{
+  margin-left: 30rpx;
+  margin-right: 30rpx;
+  width: auto;
+  border-radius: 20rpx;
+  background: rgba(255, 255, 255, 0.5);
+  box-shadow: 0px 0px 20px 0 rgba(133, 100, 100, 0.37);
+  backdrop-filter: blur( 100px );
+  border: 1px solid rgba( 255, 255, 255, 0.18 );
+  z-index: -1;
+  margin-top: 5%;
+  
+}
+
+.back{
+  background-color: rgb(255, 255, 255);
+  border-radius: 20%;
+}
+
+.pre-search{
+    width: 95%;
+    height:1100rpx;
+    margin-top: 10%;
+    background-color: rgb(255, 255, 255);
+    float: left;
+    padding-top: 5%;
+    padding-left: 5%;
+    border-radius: 40rpx;
+    box-shadow: 0px 0px 20px 0 rgba(133, 100, 100, 0.37);
+}
+
+.types{
+    width: 100%;
+    position: relative;
+    height:100rpx;
+    font-weight: bold;
+    font-size: medium;
+}
+
+.pre-search-results{
+    position: relative;
+    width:65%;
+    margin-left: 30%;
+    height:1100rpx;
+    margin-top: -1100rpx;
+    padding-left: 5%;
+    animation: show_up 1s;
+}
+@keyframes show_up{
+    0%{opacity: 0;}
+    100%{opacity: 1;}
+  }